@extends('content')

@section('content')
<div class="panel panel-success">
<div class="panel-heading">
	<h3 class="panel-title">修改角色信息</h3>
</div>
<div style="margin:0 auto;width:550px;">
	<div class="panel-body">
		<form class="form-horizontal" role="form" action="/roles/update"  method="post">
				<input type="hidden" name="_token" value="{{ csrf_token() }}" />
				<input type="hidden" name="id" value="{{ $data->id }}" />

			<div class="form-group">
				<label for="firstname" class="col-sm-2 control-label">职务/部门</label>
				<div class="col-sm-10">
					<input type="text" class="form-control" id="firstname"
							 placeholder="请使用中文" name="position" value="{{ $data->position }}">
				</div>
			</div>
			<div class="form-group">
				<label for="lastname" class="col-sm-2 control-label">绑定模块</label>
				<div class="col-sm-10">
					<div class="tree_content">
						@foreach($modules as $key)
						@if($key->parentId == 1)
							<div class="tree_node">
									<div class="div_inline"><input type="button" value="-" class="tree_node_toggle_button"></div>
									<div class="div_inline tree_node_parent">

											<input type="checkbox" value="{{ $key->id }}" name="modules[]" class="tree_node_parent_checkbox" @foreach($module as $key7) 	@if($key7 == $key->id) checked="checked" @endif 	@endforeach>{{ $key->name }}

											<div class="tree_node_child">
											 @foreach($modules as $key1)
											 @if($key1->parentId == $key->id)
													<input type="checkbox" value="{{ $key1->id }}" name="modules[]" class="tree_node_child_checkbox" @foreach($module as $key7) 	@if($key7 == $key1->id) checked="checked" @endif 	@endforeach>{{ $key1->name }}<br>
												@endif
										    @endforeach
											</div>
									</div>
							</div>
						@endif
						@endforeach
					</div>
				</div>
			</div>
			<div class="form-group">
				<label for="lastname" class="col-sm-2 control-label">排序位置</label>
				<div class="col-sm-10">
					<input type="text" class="form-control" id="lastname"
							 placeholder="请输入排序数字" name="orderId" value="{{ $data->orderId }}">
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-10">
					<button type="submit" class="btn btn-success">提交</button>
					<button type="button" class="btn btn-warning" onclick ="window.history.go(-1)">返回</button>
				</div>
			</div>
		</form>
	</div>
</div>
</div>
<style>
	 .div_inline{
			 display: inline;
	 }
		/* 设置子节点属性 */
		.tree_node_child{ margin-left: 50px;}
</style>
<script>
		// 页面加载完成后调用
		$(function(){
				// 为所有的父节点添加点击事件
				$(".tree_node_parent_checkbox").click(function(){
						// 获取父节点是否选中
						var isChange = $(this).prop("checked");
						if(isChange){ // 如果选中,则父节点下的所有的子节点都选中
								// 获取当前checkbox节点的兄弟节点下的所有的checkbox子节点选中
								$(this).next().find(".tree_node_child_checkbox").prop("checked", true);
						}else{ // 未选中，取消全选
								// 获取当前checkbox节点的兄弟节点下的所有的checkbox子节点选中
								$(this).next().find(".tree_node_child_checkbox").removeAttr("checked");
						}
				});
				// 为所有的子节点添加点击事件
				$(".tree_node_child_checkbox").click(function () {
						// 获取选中的节点的父节点下的所有子节点选中的数量
						var length = $(this).parent().find(".tree_node_child_checkbox:checked").length;
						// 判断当前结点是否选中
						if($(this).prop("checked")){ // 选中
								// 如果当前节点选中后,所有的选中节点数量1，选中父节点
								if(length == 1){
										// 选中父节点
										$(this).parent().prev().prop("checked", true);
								}
						}else{ // 节点未选中
								if(length == 0){
										// 取消父节点的选中状态
										$(this).parent().prev().removeAttr("checked");
								}
						}
				});

				// 为所有的切换按钮添加点击事件
				$(".tree_node_toggle_button").click(function () {
						// 获取需要隐藏或显示的节点
						var $toggle_node = $(this).parent().next().find(".tree_node_child");
						$toggle_node.toggle(); // 切换隐藏或显示
						// 切换按钮的显示
						if($toggle_node.is(":visible")){
								$(this).val("-");
						}else{
								$(this).val("+");
						}
				});
		});
</script>
@stop
